<template>
	<fieldset>
		<legend>朋友</legend>
		<h1>签哥</h1>
		<h1>罗志祥</h1>
		<h1>李代沫</h1>
		<h1>黄海波</h1>
		<h1>宁财神</h1>
		<button @click="handleClick">一个朴实无华的按钮</button>
		<h1>{{$store.state.name}}</h1>
	</fieldset>
</template>
<script>
	export default {
		methods: {
			handleClick() {
				//跳转到发现页
				console.log(this.$router);

				//编程式的一些方法
				//1.push 往浏览器的历史记录栈中添加一个记录,并且跳转页面
				//this.$router.push('/discover') //直接传入路径
				//this.$router.push({ name: "playlist" }); //传入路由的名字
				//路由传递参数的方式有哪些?怎么传递的?
				//1.params 问题:1.刷新页面之后,params传递的参数会丢失 2.如果通过path进行跳转的时候,会自动的忽略掉params这个属性,只能通过name属性来进行跳转,才能携带params
				// this.$router.push({ path: "/discover/playlist", params: { msg: "退" } });
				//2.query query刷新页面不会丢失参数
				// this.$router.push({
				// 	name:"playlist",
				// 	query: { name: "程潇" },
				// });
				//3.直接通过window来进行传递
				// window.gg = "黎族兄妹";

				//2.replace 替换当前历史记录值,用法和push是一摸一样的

				// this.$router.replace('/discover')

				//3.go(number) 去到历史记录栈中的第几个,里面可以传入数字正值或者负值 当传入的数字超出了历史记录 那么直接失效 

				// this.$router.go(20)

				//4.back 返回上一级
				
				// this.$router.back()
				//5.forward 前进下一个
				// this.$router.forward()
			},
		},
		mounted() {},
	};
</script>
